﻿@using MobileTrack.Core;
@{
    this.ViewBag.Title = "Ribeiro | MobileTrack | IMEIs";
}
<div id="filterForm">
    <form action="@this.Url.Action("Index")" method="get">
    <span>Filtro:</span>
    <input style="border:1px solid #F26631" type="text" id="filter" name="filter" value="@this.ViewBag.Filter" />
    <a href="#" onclick="$('#filterForm form').submit();" style="text-decoration: none;">
        <img alt="Filtrar" style="border: 0px; vertical-align: text-bottom; padding: 0px 2px;"
            src="~/Images/buscar2.png" /></a> <span>(ej: producto:samsung+ingreso:2012-10-15)</span>
    </form>
</div>
<table style="width: 100%; margin-top: 0px;">
    <tr>
        <td style="width: 150px; padding: 5px; vertical-align: top;">
            <div style="font-size: 0.9em; padding: 7px; background: #F9F9F9">
                <div id="selectedFilters" style="display: none; padding-bottom: 10px; border-bottom: 1px solid #aaaaaa;">
                    <div>
                        <b style="color:#F26631">Filtrado por</b>
                    </div>
                </div>
                <div id="estadoFilter">
                    <b style="color:#F26631">Estado</b>
                    @foreach (string estado in (IEnumerable<string>)this.ViewBag.EstadosFilter)
                    {
                        <br />
                        <span><a class="filterLink" href="#" onclick="applyFilter('estadoFilter', 'Estado:' + '@estado')">@estado</a>&nbsp;</span>
                    }
                </div>
                <div id="operadorFilter" style="margin-top: 5px;">
                    <b style="color:#F26631">Operador</b>
                    @foreach (string operador in (IEnumerable<string>)this.ViewBag.OperadoresFilter)
                    {
                        <br />
                        <span><a class="filterLink" href="#" onclick="applyFilter('operadorFilter', 'Operador:' + '@operador')">@operador</a>&nbsp;</span>
                    }
                </div>
                <div id="ubicacionFilter" style="margin-top: 5px;">
                    <b style="color:#F26631">Ubicacion</b>
                    @foreach (string ubicacion in (IEnumerable<string>)this.ViewBag.UbicacionesFilter)
                    {
                        <br />
                        <span><a class="filterLink" href="#" onclick="applyFilter('ubicacionFilter', 'Ubicacion:' + '@ubicacion')">@ubicacion</a>&nbsp;</span>
                    }
                </div>
            </div>
        </td>
        <td style="vertical-align: top; padding: 5px;">
            <div>
                <table style="padding: 5px;" id="imeis">
                </table>
                <div id="imeispager">
                </div>
            </div>
            @if (this.User.IsInRole(Constants.AdministradorRole))
            {
                 <div style="margin-top: 10px; padding: 5px; background: #F9F9F9">
                    <input id="bulkButton" type="button" value="Enviar Lote" style="font-size: 0.9em; color: #000000" />
                    <input id="bulkButtonReceive" type="button" value="Recibir Lote" style="font-size: 0.9em; color: #000000" />
                </div>
            }
            else
            {
                if (this.User.IsInRole(Constants.DespachanteRole))
                {
                    <div style="margin-top: 10px; padding: 5px; background: #F9F9F9">
                        <input id="bulkButton" type="button" value="Enviar Lote" style="font-size: 0.9em; color: #000000" />
                    </div>
                }
                if (this.User.IsInRole(Constants.ReceptorRole))
                {
                    <div style="margin-top: 10px; padding: 5px; background: #F9F9F9">
                        <input id="bulkButtonReceive" type="button" value="Recibir Lote" style="font-size: 0.9em; color: #000000" />
                    </div>
                }
            }
        </td>
    </tr>
</table>
<div id="bulkSendDialog" title="Enviar Lote">
    <div id="leftImeis" style="float:left; padding:10px 20px 10px 0px; width:260px;">
        <b>Equipos a enviar:</b>
        <div id="imeiList" style="padding:0px 10px 10px 10px">
        </div>
    </div>
    <div id="rightDetails"></div>
</div>
<div id="bulkReceiveDialog" title="Recibir Lote">
    <div id="leftImeisR" style="float:left; padding:10px 20px 10px 0px; width:260px;">
        <b>Equipos a recibir:</b>
        <div id="imeiListR" style="padding:0px 10px 10px 10px">
        </div>
    </div>
    <div id="rightDetailsR"></div>
</div>
<div id="imeiDialog" title="Asociar IMEI a Celular">
</div>
<div id="sendImeiDialog" title="Enviar Celular">
</div>
<div id="receiveImeiDialog" title="Recibir Celular">
</div>
<div id="sellImeiDialog" title="Vender Celular">
</div>
<div id="returnImeiDialog" title="Devolver Celular">
</div>
@section scripts {
    <script type="text/javascript">
        var currentFilter = '@this.Request.QueryString["filter"]';
        var appliedFilters = [];

        $(document).ready(function () {
            $('#imeis').jqGrid({
                url: '@this.Url.Action("List")',
                datatype: 'json',
                postData: { filter: $("<div/>").html('@this.Request.QueryString["filter"]').text() },
                shrinkToFit: true,
                autowidth: true,
                rowNum: 50,
                rowList: [10, 50, 100],
                width: 'auto',
                height: 'auto',
                caption: "IMEIs",
                sortable: false,
                cellEdit: false,
                multiselect: true,
                cellsubmit: 'clientArray',
                pager: '#imeispager',
                jsonReader: { repeatitems: false, id: '0' },
                colNames: ['Id', 'IMEINro', 'IMEI', 'Producto', 'Ingreso', 'Operador', 'Estado', 'Ubicación', 'Comprobante', 'Comandos'],
                colModel: [
                    { name: 'Id', index: 'Id', hidden: true },
                    { name: 'Imei', index: 'Imei', hidden: true },
                    { name: 'ImeiLink', index: 'ImeiLink', width: 140 },
                    { name: 'Producto', index: 'Producto' },
                    { name: 'Ingreso', index: 'Ingreso', width: 90 },
                    { name: 'Operador', index: 'Operador', width: 100 },
                    { name: 'Estado', index: 'Estado', width: 125 },
                    { name: 'Ubicacion', index: 'Ubicacion' },
                    { name: 'Comprobante', index: 'Comprobante' },
                    { name: 'Comandos', index: 'Comandos', width: 120 }
   	            ]
            });

            $('#imeis').jqGrid('navGrid', '#imeispager', { search: false, edit: false, add: false, del: false });

            function notifCallback() {
                setTimeout(function () {
                    $("#confirmOper").fadeOut(600);
                }, 3000);
            };

            $("#bulkButton").button()
                            .click(function () { bulkSendDialog(); });

            $("#bulkButtonReceive").button()
                            .click(function () { bulkReceiveDialog(); });

            $("#imeiDialog").dialog({
                modal: true,
                height: 360,
                width: 400,
                autoOpen: false,
                resizable: false,
                buttons: {
                    "Guardar": function () {
                        if ($("form").validate().form()) {
                            $.ajax({
                                url: '@this.Url.Action("AssociateImei")',
                                type: 'POST',
                                data: $("#imeiDialog form").serialize(),
                                success: function (result) {
                                    if (result.saved) {
                                        $("#imeiDialog").dialog("close");
                                        var n = noty({ text: "La operacion se realizo exitosamente.", type: 'success' });
                                        $("#imeis").trigger("reloadGrid");
                                    }
                                    else {
                                        $("#imeiDialog").html(result);
                                        $("#imeiDialog form fieldset #Fecha").datepicker({ dateFormat: 'dd/mm/yy' });
                                        $.validator.unobtrusive.parse('#imeiDialog');
                                        $("#imeiDialog").dialog('open');
                                    }
                                }
                            });
                        }
                    },
                    "Cancelar": function () {
                        $(this).dialog("close");
                    }
                }
            });

            $("#sendImeiDialog").dialog({
                modal: true,
                height: 410,
                width: 400,
                autoOpen: false,
                resizable: false,
                buttons: {
                    "Guardar": function () {
                        if ($("form").validate().form()) {
                            $.ajax({
                                url: '@this.Url.Action("SendImei")',
                                type: 'POST',
                                data: $("#sendImeiDialog form").serialize(),
                                success: function (result) {
                                    if (result.saved) {
                                        $("#sendImeiDialog").dialog("close");
                                        var n = noty({ text: "La operacion se realizo exitosamente.", type: 'success' });
                                        $("#imeis").trigger("reloadGrid");
                                    }
                                    else {
                                        $("#sendImeiDialog").html(result);
                                        $("#sendImeiDialog form fieldset #FechaEnv").datepicker({ dateFormat: 'dd/mm/yy' });
                                        $.validator.unobtrusive.parse('#sendImeiDialog');
                                        $("#sendImeiDialog").dialog('open');
                                    }
                                }
                            });
                        }
                    },
                    "Cancelar": function () {
                        $(this).dialog("close");
                    }
                }
            });

            $("#receiveImeiDialog").dialog({
                modal: true,
                height: 410,
                width: 400,
                autoOpen: false,
                resizable: false,
                buttons: {
                    "Guardar": function () {
                        if ($("form").validate().form()) {
                            $.ajax({
                                url: '@this.Url.Action("ReceiveImei")',
                                type: 'POST',
                                data: $("#receiveImeiDialog form").serialize(),
                                success: function (result) {
                                    if (result.saved) {
                                        $("#receiveImeiDialog").dialog("close");
                                        var n = noty({ text: "La operacion se realizo exitosamente.", type: 'success' });
                                        $("#imeis").trigger("reloadGrid");
                                    }
                                    else {
                                        $("#receiveImeiDialog").html(result);
                                        $("#receiveImeiDialog form fieldset #FechaRec").datepicker({ dateFormat: 'dd/mm/yy' });
                                        $.validator.unobtrusive.parse('#receiveImeiDialog');
                                        $("#receiveImeiDialog").dialog('open');
                                    }
                                }
                            });
                        }
                    },
                    "Cancelar": function () {
                        $(this).dialog("close");
                    }
                }
            });

            $("#sellImeiDialog").dialog({
                modal: true,
                height: 410,
                width: 400,
                autoOpen: false,
                resizable: false,
                buttons: {
                    "Guardar": function () {
                        if ($("form").validate().form()) {
                            $.ajax({
                                url: '@this.Url.Action("SellImei")',
                                type: 'POST',
                                data: $("#sellImeiDialog form").serialize(),
                                success: function (result) {
                                    if (result.saved) {
                                        $("#sellImeiDialog").dialog("close");
                                        var n = noty({ text: "La operacion se realizo exitosamente.", type: 'success' });
                                        $("#imeis").trigger("reloadGrid");
                                    }
                                    else {
                                        $("#sellImeiDialog").html(result);
                                        $("#sellImeiDialog form fieldset #FechaVenta").datepicker({ dateFormat: 'dd/mm/yy' });
                                        $.validator.unobtrusive.parse('#sellImeiDialog');
                                        $("#sellImeiDialog").dialog('open');
                                    }
                                }
                            });
                        }
                    },
                    "Cancelar": function () {
                        $(this).dialog("close");
                    }
                }
            });

            $("#returnImeiDialog").dialog({
                modal: true,
                height: 410,
                width: 400,
                autoOpen: false,
                resizable: false,
                buttons: {
                    "Guardar": function () {
                        if ($("form").validate().form()) {
                            $.ajax({
                                url: '@this.Url.Action("ReturnImei")',
                                type: 'POST',
                                data: $("#returnImeiDialog form").serialize(),
                                success: function (result) {
                                    if (result.saved) {
                                        $("#returnImeiDialog").dialog("close");
                                        var n = noty({ text: "La operacion se realizo exitosamente.", type: 'success' });
                                        $("#imeis").trigger("reloadGrid");
                                    }
                                    else {
                                        $("#returnImeiDialog").html(result);
                                        $("#returnImeiDialog form fieldset #FechaDev").datepicker({ dateFormat: 'dd/mm/yy' });
                                        $.validator.unobtrusive.parse('#returnImeiDialog');
                                        $("#returnImeiDialog").dialog('open');
                                    }
                                }
                            });
                        }
                    },
                    "Cancelar": function () {
                        $(this).dialog("close");
                    }
                }
            });

            $("#bulkSendDialog").dialog({
                modal: true,
                height: 410,
                width: 640,
                autoOpen: false,
                resizable: false,
                buttons: {
                    "Guardar": function () {
                        if ($("#bulkSendDialog #rightDetails form").validate().form()) {
                            $.ajax({
                                url: '@this.Url.Action("BulkSend")',
                                type: 'POST',
                                data: $("#bulkSendDialog #rightDetails form").serialize(),
                                success: function (result) {
                                    if (result.saved) {
                                        $("#bulkSendDialog").dialog("close");
                                        var n = noty({ text: "La operacion se realizo exitosamente.", type: 'success' });
                                        $("#imeis").trigger("reloadGrid");
                                    }
                                    else {
                                        $("#bulkSendDialog #rightDetails").html(result);
                                        $("#bulkSendDialog #rightDetails form fieldset #FechaEnv").datepicker({ dateFormat: 'dd/mm/yy' });
                                        $.validator.unobtrusive.parse('#bulkSendDialog');
                                        $("#bulkSendDialog").dialog('open');
                                    }
                                }
                            });
                        }
                    },
                    "Cancelar": function () {
                        $(this).dialog("close");
                    }
                }
            });

            $("#bulkReceiveDialog").dialog({
                modal: true,
                height: 410,
                width: 640,
                autoOpen: false,
                resizable: false,
                buttons: {
                    "Guardar": function () {
                        if ($("#bulkReceiveDialog #rightDetailsR form").validate().form()) {
                            $.ajax({
                                url: '@this.Url.Action("BulkReceive")',
                                type: 'POST',
                                data: $("#bulkReceiveDialog #rightDetailsR form").serialize(),
                                success: function (result) {
                                    if (result.saved) {
                                        $("#bulkReceiveDialog").dialog("close");
                                        var n = noty({ text: "La operacion se realizo exitosamente.", type: 'success' });
                                        $("#imeis").trigger("reloadGrid");
                                    }
                                    else {
                                        $("#bulkReceiveDialog #rightDetailsR").html(result);
                                        $("#bulkReceiveDialog #rightDetailsR form fieldset #FechaRec").datepicker({ dateFormat: 'dd/mm/yy' });
                                        $.validator.unobtrusive.parse('#bulkReceiveDialog');
                                        $("#bulkReceiveDialog").dialog('open');
                                    }
                                }
                            });
                        }
                    },
                    "Cancelar": function () {
                        $(this).dialog("close");
                    }
                }
            });

            $("#filterForm form").submit(function () {
                filterGrid();
                return false;
            });

        });

        function bulkSendDialog() {
            $.ajax({
                url: '@this.Url.Action("BulkSend")',
                type: "GET",
                success: function (result) {

                    $("#bulkSendDialog #leftImeis .selImei").remove();

                    var ids = $("#imeis").jqGrid('getGridParam', 'selarrrow');

                    if (ids.length > 0) {
                        var imeis = [];
                        for (var i = 0, il = ids.length; i < il; i++) {
                            var imei = $("#imeis").jqGrid('getCell', ids[i], 'Imei');
                            var producto = $("#imeis").jqGrid('getCell', ids[i], 'Producto');
                            var estado = $("#imeis").jqGrid('getCell', ids[i], 'Estado');
                            var comandos = $("#imeis").jqGrid('getCell', ids[i], 'Comandos');

                            if (imei == '') {
                                var n = noty({ text: "Ha seleccionado un celular sin IMEI", type: 'warning' });
                                return;
                            }
                            if ((estado != 'Disponible Venta') && (estado != 'En Deposito')) {
                                var n = noty({ text: "Ha seleccionado un celular con un estado invalido para envio", type: 'warning' });
                                return;
                            }
                            if (comandos.indexOf("Envio") == -1) {
                                var n = noty({ text: "No tiene permisos para enviar uno de los celulares seleccionados", type: 'warning' });
                                return;
                            }

                            imeis.push(imei);

                            $("#bulkSendDialog #leftImeis").append('<div class="selImei" style="border-bottom:1px solid #cccccc"><p>&gt; ' + imei + '</p><p style="color:#555555;padding-left:10px;">' + producto + '</p></div>');
                        }

                        $("#bulkSendDialog #rightDetails").html(result);
                        $("#bulkSendDialog #rightDetails form fieldset #Ids").val(ids.join(","));
                        $("#bulkSendDialog #rightDetails form fieldset #Imeis").val(imeis.join(","));
                        $("#bulkSendDialog #rightDetails form fieldset #FechaEnv").datepicker({ dateFormat: 'dd/mm/yy' });
                        $("#bulkSendDialog #rightDetails form fieldset #FechaEnv").datepicker("setDate", new Date());
                        $.validator.unobtrusive.parse('#bulkSendDialog');
                        $("#bulkSendDialog").dialog('open');
                    }
                }
            });
        }

        function bulkReceiveDialog() {
            $.ajax({
                url: '@this.Url.Action("BulkReceive")',
                type: "GET",
                success: function (result) {

                    $("#bulkReceiveDialog #leftImeisR .selImei").remove();

                    var ids = $("#imeis").jqGrid('getGridParam', 'selarrrow');

                    if (ids.length > 0) {
                        var imeis = [];
                        for (var i = 0, il = ids.length; i < il; i++) {
                            var imei = $("#imeis").jqGrid('getCell', ids[i], 'Imei');
                            var producto = $("#imeis").jqGrid('getCell', ids[i], 'Producto');
                            var comprobante = $("#imeis").jqGrid('getCell', ids[i], 'Comprobante');
                            var estado = $("#imeis").jqGrid('getCell', ids[i], 'Estado');
                            var comandos = $("#imeis").jqGrid('getCell', ids[i], 'Comandos');

                            if (imei == '') {
                                var n = noty({ text: "Ha seleccionado un celular sin IMEI", type: 'warning' });
                                return;
                            }
                            if (estado != 'En Transito') {
                                var n = noty({ text: "Ha seleccionado un celular con un estado invalido para recepcion", type: 'warning' });
                                return;
                            }
                            if (comandos.indexOf("Recepcion") == -1) {
                                var n = noty({ text: "No tiene permisos para recibir uno de los celulares seleccionados", type: 'warning' });
                                return;
                            }

                            imeis.push(imei);

                            $("#bulkReceiveDialog #leftImeisR").append('<div class="selImei" style="border-bottom:1px solid #cccccc"><p>&gt; ' + imei + '</p><p style="color:#555555;padding-left:10px;">' + producto + '</p><p style="color:#555555;padding-left:10px;">' + comprobante + '</p></div>');
                        }

                        $("#bulkReceiveDialog #rightDetailsR").html(result);
                        $("#bulkReceiveDialog #rightDetailsR form fieldset #Ids").val(ids.join(","));
                        $("#bulkReceiveDialog #rightDetailsR form fieldset #Imeis").val(imeis.join(","));
                        $("#bulkReceiveDialog #rightDetailsR form fieldset #FechaRec").datepicker({ dateFormat: 'dd/mm/yy' });
                        $("#bulkReceiveDialog #rightDetailsR form fieldset #FechaRec").datepicker("setDate", new Date());
                        $.validator.unobtrusive.parse('#bulkReceiveDialog');
                        $("#bulkReceiveDialog").dialog('open');
                    }
                }
            });
        }

        function imeiDialog(index) {
            $.ajax({
                url: '@this.Url.Action("AssociateImei")',
                type: "GET",
                success: function (result) {
                    $("#imeiDialog").html(result);
                    var datarow = $("#imeis").jqGrid('getRowData', index);
                    $("#imeiDialog form fieldset #Id").val(index);
                    $("#imeiDialog form fieldset #Producto").val(datarow.Producto);
                    $("#imeiDialog form fieldset #Fecha").datepicker({ dateFormat: 'dd/mm/yy' });
                    $("#imeiDialog form fieldset #Fecha").datepicker("setDate", new Date());
                    $.validator.unobtrusive.parse('#imeiDialog');
                    $("#imeiDialog").dialog('open');
                }
            });
        }

        function sendImeiDialog(index) {
            $.ajax({
                url: '@this.Url.Action("SendImei")',
                type: "GET",
                success: function (result) {
                    $("#sendImeiDialog").html(result);
                    var datarow = $("#imeis").jqGrid('getRowData', index);
                    $("#sendImeiDialog form fieldset #Id").val(index);
                    $("#sendImeiDialog form fieldset #Producto").val(datarow.Producto);
                    $("#sendImeiDialog form fieldset #Imei").val(datarow.Imei);
                    $("#sendImeiDialog form fieldset #FechaEnv").datepicker({ dateFormat: 'dd/mm/yy' });
                    $("#sendImeiDialog form fieldset #FechaEnv").datepicker("setDate", new Date());
                    $.validator.unobtrusive.parse('#sendImeiDialog');
                    $("#sendImeiDialog").dialog('open');
                }
            });
        }

        function receiveImeiDialog(index) {
            $.ajax({
                url: '@this.Url.Action("ReceiveImei")',
                type: "GET",
                success: function (result) {
                    $("#receiveImeiDialog").html(result);
                    var datarow = $("#imeis").jqGrid('getRowData', index);
                    $("#receiveImeiDialog form fieldset #Id").val(index);
                    $("#receiveImeiDialog form fieldset #Producto").val(datarow.Producto);
                    $("#receiveImeiDialog form fieldset #Imei").val(datarow.Imei);
                    $("#receiveImeiDialog form fieldset #Comprobante").val(datarow.Comprobante);
                    $("#receiveImeiDialog form fieldset #FechaRec").datepicker({ dateFormat: 'dd/mm/yy' });
                    $("#receiveImeiDialog form fieldset #FechaRec").datepicker("setDate", new Date());
                    $.validator.unobtrusive.parse('#receiveImeiDialog');
                    $("#receiveImeiDialog").dialog('open');
                }
            });
        }

        function sellImeiDialog(index) {
            $.ajax({
                url: '@this.Url.Action("SellImei")',
                data: { id: index },
                type: "GET",
                success: function (result) {
                    $("#sellImeiDialog").html(result);
                    var datarow = $("#imeis").jqGrid('getRowData', index);
                    $("#sellImeiDialog form fieldset #Id").val(index);
                    $("#sellImeiDialog form fieldset #Producto").val(datarow.Producto);
                    $("#sellImeiDialog form fieldset #Imei").val(datarow.Imei);
                    $("#sellImeiDialog form fieldset #FechaVenta").datepicker({ dateFormat: 'dd/mm/yy' });
                    $("#sellImeiDialog form fieldset #FechaVenta").datepicker("setDate", new Date());
                    $.validator.unobtrusive.parse('#sellImeiDialog');
                    $("#sellImeiDialog").dialog('open');
                }
            });
        }

        function returnImeiDialog(index) {
            $.ajax({
                url: '@this.Url.Action("ReturnImei")',
                data: { id: index },
                type: "GET",
                success: function (result) {
                    $("#returnImeiDialog").html(result);
                    var datarow = $("#imeis").jqGrid('getRowData', index);
                    $("#returnImeiDialog form fieldset #Id").val(index);
                    $("#returnImeiDialog form fieldset #Producto").val(datarow.Producto);
                    $("#returnImeiDialog form fieldset #Imei").val(datarow.Imei);
                    $("#returnImeiDialog form fieldset #FechaDev").datepicker({ dateFormat: 'dd/mm/yy' });
                    $("#returnImeiDialog form fieldset #FechaDev").datepicker("setDate", new Date());
                    $.validator.unobtrusive.parse('#returnImeiDialog');
                    $("#returnImeiDialog").dialog('open');
                }
            });
        }

        function filterGrid() {
            var isFirst = true;
            currentFilter = $("#filterForm form #filter").val();
            currentFilter = $('<div/>').html(currentFilter).text();

            for (var i = 0; i < appliedFilters.length; i++) {
                if ((isFirst == true) && (currentFilter == '')) {
                    currentFilter = appliedFilters[i][1];
                    isFirst = false;
                }
                else {
                    currentFilter = currentFilter + '+' + appliedFilters[i][1];
                }
            }

            $("#imeis").setGridParam({ postData: { filter: currentFilter} });
            $("#imeis").trigger("reloadGrid");
        }

        function applyFilter(filterDivId, filterStr) {
            var newFilter = [];
            newFilter[0] = filterDivId;
            newFilter[1] = filterStr;
            appliedFilters.push(newFilter);
            $("#" + filterDivId).hide();
            filterGrid();
            showSelectedFilters();
        }

        function showSelectedFilters() {
            if (appliedFilters.length > 0) {
                $("#selectedFilters .appliedFilter").remove();

                for (var i = 0; i < appliedFilters.length; i++) {
                    var filterToSplit = appliedFilters[i][1];
                    var filterStrings = filterToSplit.split(":");
                    $("#selectedFilters").append('<div class="appliedFilter"><a class="btn-remove" href="#" onclick="removeAppliedFilter(' + i + ')">X</a>' + filterStrings[0] + ': ' + filterStrings[1] + '</div>');
                }

                $("#selectedFilters").show();
            }
            else {
                $("#selectedFilters").hide();
            }
        }

        function removeAppliedFilter(itemIndex) {
            var filterToShow = appliedFilters[itemIndex][0];
            $("#" + filterToShow).show();
            appliedFilters.splice(itemIndex, 1);
            filterGrid();
            showSelectedFilters();
        }

    </script>
}
